/*字典管理,作者:高振中,日期:2021-02-19 17:18:03*/
<template>
  <div>
    <el-form :inline="true">
      <el-form-item label="字典名称"> <el-input placeholder="请输入字典名称" size="mini" v-model="form.name"></el-input> </el-form-item>
      <el-form-item label="字典编码"> <el-input placeholder="请输入字典编码" size="mini" v-model="form.code"></el-input> </el-form-item>
      <el-form-item>
        <el-button size="mini" @click="loadData">查询</el-button>
        <el-button size="mini" @click="doReset">重置</el-button>
        <el-button size="mini" @click="doAdd" type="primary">添加</el-button>
        <el-button size="mini" @click="doDelete(selectIds)" v-if="selectIds.length > 0">删除</el-button>
      </el-form-item>
    </el-form>
    <el-table :data="dataList" v-loading="loading" element-loading-text="正在加载......" @selection-change="selectChange" border :row-style="iRowStyle" :cell-style="iCellStyle" :header-row-style="iHeaderRowStyle" :header-cell-style="iHeaderCellStyle">
      <el-table-column type="selection" width="35"></el-table-column>
      <el-table-column prop="name" label="字典名称"></el-table-column>
      <el-table-column prop="code" label="字典编码"></el-table-column>
      <el-table-column prop="remark" label="备注"></el-table-column>
      <el-table-column label="操作" width="350">
        <template slot-scope="props">
          <div>
            <el-button type="text" size="mini" @click="queryItemList(props.row)">编辑字典项</el-button>
            <el-button type="text" size="mini" @click="doEdit(props.row)">编辑</el-button>
            <el-button type="text" size="mini" @click="doDelete([props.row.id])">删除</el-button>
          </div>
        </template>
      </el-table-column>
    </el-table>
    <div style="text-align: right" v-if="total > 0">
      <el-pagination layout="total, sizes, prev, pager, next, jumper" :current-page="page" :total="total" @current-change="(page) => pageChange(page)" :page-sizes="[20, 30, 50, 100]" @size-change="(size) => sizeChange(size)" :page-size="size" mini></el-pagination>
    </div>
    <DictDialog ref="dialog" :loadData="loadData"></DictDialog>
    <DictItemList ref="itemList"></DictItemList>
  </div>
</template>
<script>
import DictDialog from "./DictDialog";
import DictItemList from "../dictitem/DictItemList";
import { pageMix } from "@/common/page";
export default {
  mixins: [pageMix],
  components: { DictDialog, DictItemList },
  data() { return {}; },
  created() { this.loadData(); },
  methods: {
    /**字典项-列表 */
    queryItemList(row) { this.$refs["itemList"].showItemList(row.id); },
    /**字典-查询参数 */
    initForm() { return { name: null, /*字典名称*/ code: null, /*字典编码*/ remark: null, /*备注*/ }; },
    /**字典-分页列表 */
    loadData() {
      this.loading = true;
      const param = { ...this.form, page: this.page, size: this.size };
      this.rq.post("/dict/page", param).then((res) => {
        if (res.code == 200) { this.dataList = res.data.dataList; this.total = res.data.rowCount; } else this.$message.error(res.msg);
      });
      this.loading = false;
    },
    /**字典-删除 */
    doDelete(ids) {
      this.$confirm("你确定要删除吗?", "提示", { confirmButtonText: "确定", cancelButtonText: "取消", type: "warning" }).then(() => {
        this.rq.post("/dict/delete", ids).then((res) => {
          if (res.code == 200) { this.$message.success("删除成功"); this.loadData(); } else this.$message.error(res.msg);
        });
      });
    },
  },
};
</script>
<style scoped lang="scss"></style>
